import React, { useEffect, useState } from 'react';
import { getChannels } from 'api/channel';
import { Select } from 'antd';
const { Option } = Select;

export default function Channel(props) {
  // 定义接收频道列表
  const [channels, setChannels] = useState([]);

  // 获取频道列表数据
  const getChannel = async () => {
    const res = await getChannels();
    console.log(13, res);
    setChannels(res.data.channels);
  };

  // const checkRef = useRef({});
  //   频道列表的change事件
  // const onchange = (id) => {
  //   // console.log(id);
  //   const channel = channels.filter((item) => item.id === id);
  //   console.log(21, channel);
  //   checkRef.current = channel;
  // };

  useEffect(() => {
    getChannel();
  }, []);
  return (
    <Select
      placeholder="请选择频道"
      style={{ width: 200 }}
      // onChange={onChange}
      // // value={checkRef.current.name}
      // value={value}
      // 通过父组件传递value和onChange过来，索性就将所有数据传过来
      {...props}
      // defaultValue={0}
    >
      {channels.map((item) => (
        <Option value={item.id} key={item.id}>
          {item.name}
        </Option>
      ))}
    </Select>
  );
}
